<template>
  <v-page style="min-height: 100vh">
    <view class="layout-main">
      <!-- 头像 -->
      <view class="bg-light p-lg border-t border-b">
        <view
          class="d-flex align-center h-22 justify-between"
          style="line-height: 22px"
        >
          <view class="user-info color-default fn-16"> 头像 </view>
          <view class="msg u-text-right d-flex align-center">
            <user-head class="w-36 h-36"></user-head>
            <view class="iconfont color-tips" style="line-height: 21px">
              &#xe601;
            </view>
          </view>
        </view>
      </view>
      <!-- 昵称 -->
      <view class="bg-light p-lg border-t border-b">
        <view
          class="d-flex align-center h-22 justify-between"
          style="line-height: 22px"
        >
          <view class="user-info color-default fn-16"> 昵称 </view>
          <view class="msg u-text-right d-flex align-center">
            <view class="fn-14 color-gray-1 fn-14 color-gray-1name">
              铭辉品牌策划与设计
            </view>
            <view class="iconfont color-tips" style="line-height: 21px">
              &#xe601;
            </view>
          </view>
        </view>
      </view>
      <!-- 微聊号 -->
      <view class="bg-light p-lg border-t border-b">
        <view
          class="d-flex align-center h-22 justify-between"
          style="line-height: 22px"
        >
          <view class="user-info color-default fn-16">微聊号 </view>
          <view class="msg u-text-right d-flex align-center">
            <view class="fn-14 color-gray-1 fn-14 color-gray-1num">
              未设置
            </view>
            <view class="iconfont color-tips" style="line-height: 21px">
              &#xe601;
            </view>
          </view>
        </view>
      </view>
      <!-- 手机号 -->
      <view class="bg-light p-lg border-t border-b">
        <view
          class="d-flex align-center h-22 justify-between"
          style="line-height: 22px"
        >
          <view class="user-info color-default fn-16"> 手机号 </view>
          <view class="msg u-text-right d-flex align-center">
            <view class="fn-14 color-gray-1 fn-14 color-gray-1pho">
              12345685555
            </view>
            <view class="iconfont color-tips" style="line-height: 21px">
              &#xe601;
            </view>
          </view>
        </view>
      </view>
      <!-- 实名认证 -->
      <view class="bg-light p-lg border-t border-b">
        <view
          class="d-flex align-center h-22 justify-between"
          style="line-height: 22px"
        >
          <view class="user-info color-default fn-16"> 实名认证 </view>
          <view class="msg u-text-right d-flex align-center">
            <view class="fn-14 color-gray-1 fn-14 color-gray-1auth">
              已认证
            </view>
            <view class="iconfont color-tips" style="line-height: 21px">
              &#xe601;
            </view>
          </view>
        </view>
      </view>
      <!-- 分享名片 -->
      <view class="bg-light p-lg border-t border-b">
        <view
          class="d-flex align-center h-22 justify-between"
          style="line-height: 22px"
        >
          <view class="user-info color-default fn-16"> 分享我的名片 </view>
          <view class="msg u-text-right d-flex align-center">
            <view class="iconfont color-tips" style="line-height: 21px">
              &#xe601;
            </view>
          </view>
        </view>
      </view>
      <!-- 个性签名 -->
      <view class="bg-light m-t-sm p-md">
        <p class="fn-14">个性签名</p>
        <view class="m-t-sm">
          <v-input placeholder="输入个性签名"></v-input>
        </view>
      </view>
      <!-- 退出登录按钮 -->
      <view class="btn d-flex align-center justify-center m-t-lg">
        <v-botton
          class="u-btn--theme fn-20 rounded-md"
          :hairLine="false"
          type="default"
          >退出登录</v-botton
        >
      </view>
    </view>
  </v-page>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
.u-btn--theme {
  text-align: center;
  padding: 22rpx 170rpx;
  color: #ffffff;
  border-color: $theme;
  background-color: $theme;
  margin-top: 120rpx;
}
</style>